<template>
  <div>
	  <p>(You can double click on an item to turn it into a folder.)</p>

	  <ul id="demo">
		  <item class="item" :model="treeData"></item>
	  </ul>
  </div>
</template>
<script>
	import item from "@/components/Tree-item.vue"

	var data = {
		name: 'My Tree',
		children: [{
			name: 'hello'
		}, {
			name: 'wat'
		}, {
			name: 'child folder',
			children: [{
				name: 'child folder',
				children: [{
					name: 'hello'
				}, {
					name: 'wat'
				}]
			}, {
				name: 'hello'
			}, {
				name: 'wat'
			}, {
				name: 'child folder',
				children: [{
					name: 'hello'
				}, {
					name: 'wat'
				}]
			}]
		}]
	}
	export default{
		name: 'Tree',
	  data () {
	    return{
	      treeData: data
	    }
	  },
		components: {
			item
		}
	}
</script>

<style>

</style>